Skip to content

fix: linear gradient color stop fix up spec#45969

Closed
intergalacticspacehighway wants to merge 9 commits into
facebook:mainfrom
intergalacticspacehighway:linear-gradient-color-stop-fix-up
Closed

fix: linear gradient color stop fix up spec#45969
intergalacticspacehighway wants to merge 9 commits into
facebook:mainfrom
intergalacticspacehighway:linear-gradient-color-stop-fix-up

Conversation

@intergalacticspacehighway
Copy link
Copy Markdown
Contributor

@intergalacticspacehighway intergalacticspacehighway commented Aug 10, 2024

Summary:

  • Color stops needs to follow fix up spec
  • Adds multiple stops syntax support. e.g. linear-gradient(red 30% 50%, green).
  • Rename position to positions in object style API. Optional string array here makes more sense. We'll add number array support once px support is added. Will do it as a follow up to this PR.

TODOs: transition hint syntax support linear-gradient(red, 50%, green) (Done locally, dependent on this PR). px support.

Changelog:

[GENERAL] [FIXED] - Linear gradient color stop spec.

Test Plan:

  • Added testcases in processBackgroundImage-test.js

@facebook-github-bot facebook-github-bot added CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team. labels Aug 10, 2024
@NickGerleman
Copy link
Copy Markdown
Contributor

Going to mostly trust this based off of the unit tests. Function notation parsing is one of the first things on my list, once I get started back on that again.

I suspect when I turned on “ReactNativeFeatureFlags.enableBackgroundStyleApplicator, I broke gradients on Android, since the new path is on the composite drawbable. I haven’t looked around at fixing that up yet. I think it might look like “BackgroundStyleApplicator.setBackgroundImage()”.

@intergalacticspacehighway
Copy link
Copy Markdown
Contributor Author

intergalacticspacehighway commented Aug 13, 2024

Function notation parsing

yeah i agree to move everything to cpp parser eventually. I built a tiny parser in JS for this syntax instead of using regex. But this is working fine for now.

ReactNativeFeatureFlags.enableBackgroundStyleApplicator. haven’t looked around at fixing that up yet

yes, it has affected the borders. Will take a look and do a PR by this weekend

@facebook-github-bot
Copy link
Copy Markdown
Contributor

@NickGerleman has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

@facebook-github-bot
Copy link
Copy Markdown
Contributor

@NickGerleman merged this pull request in 1a49892.

@facebook-github-bot facebook-github-bot added the Merged This PR has been merged. label Aug 20, 2024
@react-native-bot
Copy link
Copy Markdown
Collaborator

This pull request was successfully merged by @intergalacticspacehighway in 1a49892

When will my fix make it into a release? | How to file a pick request?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Merged This PR has been merged. Shared with Meta Applied via automation to indicate that an Issue or Pull Request has been shared with the team.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants